<template>
    <div class="box">
        <header class="header">
            <NavBar title="确认订单" />
        </header>
        <main class="content">
            <van-cell :title="store.checkedAddress.name + ' ' + store.checkedAddress.tel"
                :label="store.checkedAddress.address" is-link @click="$router.push('/order/list')" />
            <van-empty v-if="store.orderList.length == 0"
                image="https://fastly.jsdelivr.net/npm/@vant/assets/custom-empty-image.png" image-size="80"
                description="订单为空" />
            <van-swipe-cell v-else v-for="item in store.orderList" :key="item.id">
                <van-card :num="item.count" :price="item.price" :title="item.title" :thumb="item.image" />
            </van-swipe-cell>
        </main>
    </div>
    <footer class="footer">
        <van-submit-bar :price="store.totalPrice" button-text="在线支付" @submit="onSubmit" />
    </footer>
</template>
<script setup>
import NavBar from '@/components/NavBar.vue';
import { useCounterStore } from '@/stores/counter'
import request from '@/utils/request'
const store = useCounterStore()
const onSubmit = () => {
    let obj = {
        id: new Date().getTime(), // 用时间戳做唯一值(订单id)
        title: 'NO' + new Date().getTime(), // 订单标题
        price: store.totalPrice / 100 // 订单金额
    }
    // 先 生成订单，把订单信息存起来，同时设置状态为待付款 --  等支付成功之后再把状态改为待发货
    store.addmyOrder({
        ...obj,
        status: 1, // 1代表待付款
        orderList: store.orderList, // 购物车中选中商品组成的列表
        address: store.checkedAddress // 地址
    })
    request.get('/pay', {
        params: obj
    }).then(res => {
        if (res.data.code == 200) {
            // 跳转到支付宝支付
            window.location.href = res.data.data
        }
    })
}
</script>